<template>
  <div>
    <main-layout>
      <template v-slot:top>
        <el-form ref="searchForm" :inline="true" :model="searchInfo">
         
          <el-form-item label="姓名">
            <el-input v-model="searchInfo.loginUserName" placeholder="操作者姓名" clearable />
          </el-form-item>
          <el-form-item label="时间">
            <el-date-picker v-model="time" type="datetimerange" range-separator="至" start-placeholder="开始时间"
              end-placeholder="结束时间" value-format="YYYY-MM-DD HH:mm:ss"/>
          </el-form-item>

          <el-form-item>
            <el-button size="small" type="primary" icon="search" @click="onSubmit">查询</el-button>
            <el-button size="small" icon="refresh" @click="onReset">重置</el-button>
          </el-form-item>
        </el-form>
      </template>

      <c-table ref="tableRef" :page="{ pageSize, pageIndex, total }" :lists="tableData" @current-change="handleCurrentChange"
        @size-change="handleSizeChange" :loading="loading" @selection-change="selectionChange" rowKey="userId" selectKey='userId'>
        <el-table-column align="center" label="用户" min-width="110" prop="loginUserName" />
        <el-table-column align="center" label="业务模块" min-width="120" prop="realName">
          <template #default="scope">
            后台系统登陆模块
          </template>
        </el-table-column>
        <el-table-column align="center" label="操作类型" width="100" prop="">
          <template #default="scope">
            登陆
          </template>
        </el-table-column>
        <el-table-column align="center" label="日志内容" min-width="100" prop="">
          <template #default="scope">
            <span v-if="scope.row.loginResult==1">成功</span>
            <span v-else-if="scope.row.loginResult==2">失败</span>
          </template>
        </el-table-column>
        <el-table-column align="center" label="时间" width="160" >
          <template #default="scope">
            {{ formatDateLong(scope.row.loginTime) }}
          </template>
        </el-table-column>
        <el-table-column align="center" label="IP" width="160" prop="loginIp"/>
      </c-table>
    </main-layout>

  </div>
</template>

<script setup>
import { nextTick, ref, watch, onActivated,reactive } from 'vue'
import {getloginlog} from '@/api/user'
import { ElMessageBox } from 'element-plus'

import mainLayout from '@/components/custom/mainLayout.vue'
import cTable from '@/components/custom/cTable.vue'

import {formatDateLong,phoneReplace,formatDate} from '@/utils/format'

import { useUserStore } from '@/pinia/modules/user'
import {exportToExcel} from '@/utils/exportExcel'
import {message} from '@/utils/element'
import { emitter } from '@/utils/bus.js'


const userStore = useUserStore()
onActivated(() => {
  if (userStore.pageInit) { // 需要刷新页面
    init()
  } else if (userStore.refreshFn) { // 刷新函数存在，在执行
    userStore.refreshFn()
  }
})


const pageIndex = ref(1)
const total = ref(0)
const pageSize = ref(10)
const tableData = ref([])
const searchInfo = ref({})
const loading = ref(true)
const tableRef = ref(null)
const time = ref('')

const init = () => {
  pageIndex.value = 1
  onReset()
  getTableData()
}

const onReset = () => {
  searchInfo.value = {}
  time.value = ''
}
// 搜索
const onSubmit = () => {
  pageIndex.value = 1
  tableRef.value.clear_selection()  // 清空所选
  getTableData()
}
// 分页
const handleSizeChange = (val) => {
  pageIndex.value = 1
  pageSize.value = val
  getTableData()
}

const handleCurrentChange = (val) => {
  pageIndex.value = val
  getTableData()
}

// 查询
const getTableData = async () => {
  if(time.value){
    searchInfo.value.loginTimeStart = time.value[0]
    searchInfo.value.loginTimeEnd = time.value[1]
  }
  const res = await getloginlog({ page: pageIndex.value, size: pageSize.value, ...searchInfo.value })
  if (res.code === 200) {
    tableData.value = res.data
    total.value = res.total
  }
  if(res.status==403){
    ElMessageBox.confirm('无权访问','提示',
      {
          confirmButtonText: '确定',
          showCancelButton:false,
          type: 'warning',
      }).then(async () => {
        emitter.emit('closeThisPage') // 关闭当前页面
      })
  }
  loading.value = false
}

let tableCheckeds = ref([])
const selectionChange= (items)=>{
  tableCheckeds.value = items
  //console.log("tableCheckeds",tableCheckeds.value)
}


</script>

<style lang="scss" scoped>

</style>
